import React, { Component } from 'react';
import { StyleSheet, View, Text, TouchableOpacity, Image } from 'react-native';
import screen from '../../common/screen'

class ButtonView extends Component {
    render() {
        let { title, onPress, isBg }=this.props
        return (
            <TouchableOpacity
                style={styles.container}
                onPress={() => onPress && onPress()}
                underlayColor="rgb(210, 230,255)"
                activeOpacity={0.5}
            >
                {
                    isBg ?
                        <View style={{alignItems: 'center',justifyContent: 'center',}}>
                            <Image source={require('../../img/confirm.png')} style={{ height:80,width:298}} />
                            <View style={styles.txtLayBg}>
                                {/* <Text style={styles.txtBg}>{title}</Text> */}
                            </View>
                        </View>
                        :
                        <View style={styles.txtLay}>
                            <Text style={styles.txt}>{title}</Text>
                        </View>
                }

            </TouchableOpacity>
        );
    }
}
const styles = StyleSheet.create({
    container: {
        marginVertical: 8,
    },
    txtLayBg: {
        position: 'absolute',
        left:0,
        top:0,
        width: screen.width * 0.786,
        height: 48,
        justifyContent: 'center',
        alignItems: 'center',
    },
    txtLay:{
        // width: screen.width * 0.786,
        // height: 48,
        height:48,
        width:298,
        justifyContent: 'center',
        alignItems: 'center',
        borderColor: '#5C7094',
        borderWidth: 1,
        borderRadius: 24,
        fontWeight: 'bold',        
    },
    txtBg: {
        color: 'white',
        fontSize: 16,
        fontWeight: 'bold',
    },
    txt:{
        color: '#233E6E',
        fontSize: 16,
    }
})
export default ButtonView;
